<!-- directive:title 边框样式 -->
<!-- directive:breadcrumb 边框样式 -->
<div class="panel-body">
    <section>
        <div id="repeat">图片将会循环平铺到整个边框区域。</div>
        <div id="repeat">图片将会循环平铺到整个边框区域。</div>
        <div id="stretch">图片将会拉伸平铺到整个边框区域。</div>
        <div id="round">图片将会循环平铺到整个边框区域。</div>
    </section>
    <script type="text/xianjs" ui-bs>
        <div id="repeat">图片将会循环平铺到整个边框区域。</div>
        <div id="repeat">图片将会循环平铺到整个边框区域。</div>
        <div id="stretch">图片将会拉伸平铺到整个边框区域。</div>
        <div id="round">图片将会循环平铺到整个边框区域。</div>
    </script>
    <style type="text/css" ui-bs>
        #repeat { 
            border: 15px solid transparent;
            padding: 10px 20px;
            -moz-border-image:url("../../images/border.1.png") 30 30 repeat; /* Old Firefox */
            -webkit-border-image:url("../../images/border.1.png") 30 30 repeat; /* Safari */
            -o-border-image:url("../../images/border.1.png") 30 30 repeat; /* Opera */
            border-image:url("../../images/border.1.png") 30 30 repeat;
        }
        #repeat { 
            border: 15px solid transparent;
            padding: 10px 20px;
            -moz-border-image:url("../../images/border.1.png") 30 30 round; /* Old Firefox */
            -webkit-border-image:url("../../images/border.1.png") 30 30 round; /* Safari */
            -o-border-image:url("../../images/border.1.png") 30 30 round; /* Opera */
            border-image:url("../../images/border.1.png") 30 30 round;
        }
        #stretch { 
            border: 15px solid transparent;
            padding: 10px 20px;
            -moz-border-image:url("../../images/border.1.png") 30 30 stretch; /* Old Firefox */
            -webkit-border-image:url("../../images/border.1.png") 30 30 stretch; /* Safari */
            -o-border-image:url("../../images/border.1.png") 30 30 stretch; /* Opera */
            border-image:url("../../images/border.1.png") 30 30 stretch;
        }
        #round { 
            border: 45px solid transparent;
            padding: 10px 20px;
            -moz-border-image:url("../../images/border.2.png") 45 45 round; /* Old Firefox */
            -webkit-border-image:url("../../images/border.2.png") 45 45 round; /* Safari */
            -o-border-image:url("../../images/border.2.png") 45 45 round; /* Opera */
            border-image:url("../../images/border.2.png") 45 45 round;
        }
    </style>
</div>
